<template>
  <div>
    <items-head title="提交订单" />
    <div class="wrap">
      <van-contact-card :type="OrderType"
                        :name="info.linkMan"
                        :tel="info.mobile"
                        @click="onEdit" />
      <div class="items">
        <div class="item"
             v-for="item in items"
             :key="item.id">
          <van-card :num="item.number"
                    :price="item.price*item.number"
                    :title="item.name"
                    :thumb="item.pic" />
        </div>
      </div>
      <van-submit-bar :price="total*100"
                      button-text="提交订单"
                      @submit="onSubmit" />
    </div>
  </div>
</template>

<script>
import ItemsHead from 'components/ItemsHead.vue'
import { CartItems, getContent, DefaultAddress } from 'api'
import { getToken } from 'utils'
export default {
  name: 'UpdateContacts',
  data () {
    return {
      items: [],
      total: 0,
      info: {}
    }
  },
  created () {
    this.CartItems()
    this.SwitchAddress()
  },
  methods: {
    // 获取收获地址联系人信息
    SwitchAddress () {
      if (this.$route.query.id) {
        getContent({
          id: this.$route.query.id,
          token: getToken()
        }).then((res) => {
          if (res.data.code === 0) {
            this.info = res.data.data.info
          }
        })
      } else {
        DefaultAddress({
          token: getToken()
        }).then((res) => {
          if (res.data.code === 0) {
            this.info = res.data.data.info
          }
        })
      }
    },
    // 修改收获地址联系人信息
    onEdit () {
      this.$router.push('/contlist')
    },
    onSubmit () { },
    // 获取购物车选中的商品进行结算
    CartItems () {
      CartItems({
        token: getToken()
      }).then((res) => {
        if (res.data.code === 0) {
          this.items = res.data.data.items.filter((item) => item.selected)
          this.total = res.data.data.price
        }
      })
    }
  },
  computed: {
    OrderType () {
      return this.info.id ? 'edit' : 'add'
    }
  },
  components: {
    ItemsHead
  }
}
</script>

<style lang="scss" scoped>
.wrap {
  padding: 46px 0 50px;
}
</style>
